<template>
  <div class="block">
    <el-button size="small" style="float:right" @click="$router.back(-1)">返回</el-button>
    <header  class="cen">公司项目任务书</header>

      <section class="flex">
          <aside class="left">项目部门: </aside>
          <aside class="right">编号：</aside>
      </section>
        <div class="table">  
          <div class="table-column-group">  
          <div class="table-column"></div>  
          <div class="table-column"></div>  
          <div class="table-column"></div>  
          </div>    
          <div  class="table-row-group width">  
          <ul class="table-row">  
          <li class="table-cell">项目负责人：</li>  
          </ul>   
          </div>  
          <div  class="table-row-group width">  
          <ul class="table-row">  
          <li class="table-cell">项目类型</li>  
          </ul>   
          </div>        
            <div  class="table-row-group width">  
          <ul class="table-row">  
          <li class="table-cell">项目单位：</li>  
          </ul>   
          </div>        
            <div  class="table-row-group width">  
          <ul class="table-row">  
          <li class="table-cell">项目名称：</li>  
          </ul>   
          </div>         
           <div  class="table-row-group width">  
          <ul class="table-row">  
            
          <li style="float:left" class="table-cell"><span>签约日期：</span></li>  
          <li style="float:right" class="table-cell"><span> 年   月  日</span></li>  
          </ul>   
          </div>         
           <div  class="table-row-group width">  
          <ul class="table-row">  
          <li class="table-cell">
            <span style="float:left">完成日期：</span>
            <span  style="float:right">年  月  日</span>
        </li>


            
          </ul>   
          </div>         
           <div  class="table-row-group width">  
          <ul class="table-row2">  
            <li class="table-cell">
              <span>本项目任务已下发于你，请按照完成日期要求提前十五天完成。</span>
              <span style="float:left">签发人：</span>
              <span style="float:right"> 年    月    日</span>
        </li>  
          </ul>   
          </div>  
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  }
};
</script>

<style scoped>
.table,.width{
  width:100%
}
.width{
  line-height: 100px;
    position: relative;
}
ul{margin:0;padding:0;list-style:none;}  
.table{display:table;border-collapse:collapse;border:1px solid #ccc;}  
.table-caption{display:table-caption;margin:0;padding:0;font-size:16px;}  
.table-column-group{display:table-column-group;}  
.table-column{display:table-column;width:100px;}  
.table-row-group{display:table-row-group;}  
.table-row{display:table-row;border-bottom: 1px solid #ccc}  
.table-row2{display:table-row}  
.table-row-group .table-row:hover,.table-footer-group .table-row:hover{background:#f6f6f6;}  
.table-cell{padding:0 5px;position:relative;}
.table-cell2{padding:0 5px;position:relative;}   
.table-header-group{display:table-header-group;background:#eee;font-weight:bold;}  
.table-footer-group{display:table-footer-group;}

.block{
  padding:10px 15px;
  color:#909399!important;
  width: 500px;
    margin: 33px auto;
}
.cen{
  text-align:center
}
.flex{
  display:flex;
  justify-content:space-between;
  padding:0 3px;
  margin-top: 28px;
}
</style>
